<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title></title>
	<link href="./Public/Admin/Flat/dist/css/vendor/bootstrap.min.css" rel="stylesheet">
	    <!-- Loading Flat UI -->
	<link href="./Public/Admin/Flat/dist/css/flat-ui.css" rel="stylesheet">
	<link href="./Public/Admin/Flat/docs/assets/css/demo.css" rel="stylesheet">
	<link rel="shortcut icon" href="./Public/Admin/Flat/img/favicon.ico">
	
	<!--上传插件开始  注意顺序！！！，必须是这个顺序，否则出不来-->
	   <script type="text/javascript" src="./Public/uploadify/jquery-1.8.2.min.js"></script>
	   <script type="text/javascript" src="./Public/uploadify/jquery.uploadify.min.js"></script>
	   <link rel="stylesheet" type="text/css" href="./Public/uploadify/uploadify.css"/>
	   <!--上传插件结束-->
	
	<!--调用百度内容添加插件-->
	    <script type="text/javascript" charset="utf-8" src="./Public/ueditor1_4_3/ueditor.config.js"></script>
	    <script type="text/javascript" charset="utf-8" src="./Public/ueditor1_4_3/ueditor.all.min.js"> </script>
	    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
	    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
	    <script type="text/javascript" charset="utf-8" src="./Public/ueditor1_4_3/lang/zh-cn/zh-cn.js"></script>
	
	
	
	<script type="text/javascript">
		$(function(){
			$('select[name=snshop_categroy_cid]').change(function(){
				
//				获取option里面的tid值,判断如果是顶级分类，就return
				var tid = $('option:selected').attr('tid');//抓取当前选中的option的tid自定义属性
//				将tid存储到一个隐藏域中，就是当前商品的类型
				$('input[name=snshop_type_tid]').attr('value',tid);
				
				if(tid == 0){alert("此分类为顶级分类，不可添加商品"); return;}
				
//				执行ajax异步处理
//				将得到的tid通过ajax 请求对应的php方法
				$.ajax({
					type:"post",
					url:"{{U('getTypeAttr')}}",
					data:{tid:tid},
					datatype:'json',
					success:function(phpData){
//						alert(phpData);
						var attr = '';
						var spec = '';
						$.each(phpData, function(k,v) {
//							alert(v.taname);
//							如果判断是属性的话，就存入属性的盒子里面去
							if(v.class == 0){
//								判定如果是属性的类型属性数据，就组合后写入属性的盒子中
								attr+='<tr class="info"><td>'+v.taname+'</td>';
								attr+='<td><select name="attr['+v.taid+']" id="">';
								attr+='<option value="">请选择</option>';
								$.each(v.tavalue, function(kk,vv) {
									attr+='<option value="'+vv+'">'+vv+'</option>';
								});
								attr+='</select></td></tr>';
							}else{
//							如果是规格写入规格盒子中
								spec+='<tr class="info"><td>'+v.taname+'</td>';	
								spec+='<td><select name="spec['+v.taid+'][gtvalue][]" id="">';
								spec+='<option value="">请选择</option>';
								$.each(v.tavalue, function(kk,vv) {
									spec+='<option value="'+vv+'">'+vv+'</option>';
								});
								spec+='</select></td><td>附加价格：';
								spec+='<input type="text" name="spec['+v.taid+'][added][]" id="" />';
								spec+='</td><td><span class="btn btn-success add-spec">增加规格</span>';
								spec+='</td></tr>';
							}
							
						});
//						alert(attr);
//						alert(spec);
						$('#attr').html(attr);
						$('#spec').html(spec);
					}
				});
			})
		})
	</script>
		<script type="text/javascript">
//		增加规格
		$(function(){
			$('.add-spec').live('click',function(){
//				获得当前对象的父级tr元素
				
				var parentTr = $(this).parents('tr');
//				克隆当前父级元素
				var cloneTr = parentTr.clone();
//				改变克隆中按钮的颜色等 remove-spec btn-danger 是模板自带的css样式
				cloneTr.find('.add-spec').removeClass('add-spec btn-success').addClass('remove-spec btn-danger').html('删除规格');
				
				parentTr.after(cloneTr);

			})
		})
	</script>
	<script type="text/javascript">
//		点击删除节点
		$(function(){
			$('.remove-spec').live('click',function(){
				$(this).parents('tr').remove();
			})
		})


	</script>
	
</head>
<body>
	<div class="container-fluid">
	<div class="row-fluid">
	<div class="span12">

	<form action="" method='post'>
		<fieldset>
			<legend>添加商品</legend>
			<table class='table table-bordered table-hover'>
				<thead>
					<tr>
						<th colspan="2" class="btn btn-primary">基本信息</th>
					</tr>
				</thead>
				<tbody>
					<tr class="info">
						<td>所属分类</td>
						<td>
							<select name="snshop_categroy_cid">
								<option value="0">-请选择-</option>
						{{foreach from="$cateData" key="$k" value="$v"}}
								<option value="{{$v['cid']}}" tid="{{$v['snshop_type_tid']}}">{{$v['_name']}}</option>
						{{endforeach}}
							</select>
						</td>
					</tr>
					<tr class="info">
						<td>所属品牌</td>
						<td>
							<select name="sn_brand_bid">
								<option value="0">-请选择-</option>

								{{foreach from="$brandData" key="$kk" value="$vv"}}
									<option value="{{$vv['bid']}}">{{$vv['bname']}}</option>
								{{endforeach}}

								
							</select>
						</td>
					</tr>
					<!--不需要了，因为分类表里面有类型属性的外键，添加了分类表，相当于添加了类型表主键，完全没必要，只需要在第一个jquery将获得的tid拿出来，放在一个隐藏域就好-->
					<!--<tr class="info">
						<td>所属类型</td>
						<td>
							<select name="snshop_type_tid">
								<option value="0">-请选择-</option>
		
								{{foreach from="$typeData" key="$kkk" value="$vvv"}}
									<option value="{{$vvv['tid']}}">{{$vvv['tname']}}</option>
								{{endforeach}}
		
								
							</select>
						</td>
					</tr>-->
					<tr class="info">
						<td>商品名称</td>
						<td>
							<input type="text" name='gname'/>
						</td>
					</tr>
					<tr class="info">
						<td>商品货号</td>
						<td>
							<input type="text" name='gnumber'/>
						</td>
					</tr>
					<tr class="info">
						<td>单位</td>
						<td>
							<input type="text" name='unit' value='件'/>
						</td>
					</tr>
					<tr class="info">
						<td>管理员序号</td>
						<td>
							<input type="text" name='snshop_admin_aid' value='0'/>
						</td>
					</tr>
					<tr class="info">
						<td>市价场</td>
						<td>
							<input type="text" name='marketprice'/>
						</td>
					</tr>
					<tr class="info">
						<td>商城价</td>
						<td>
							<input type="text" name='shopprice'/>
						</td>
					</tr>
					<tr class="info">
						<td>点击次数</td>
						<td>
							<input type="text" name='click'/>
						</td>
					</tr>
				</tbody>
			</table>

			<p class="btn btn-primary">商品属性</p>
			<table class="table table-bordered table-hover" id='attr' class="info">
				<tr class="info">
						<td>袖长</td>
						<td>
							<select name="" id="">
								<option value="">无袖</option>
								<option value="">无袖</option>
								<option value="">无袖</option>
							</select>
						</td>
				</tr>
				<tr class="info">
						<td>袖长</td>
						<td>
							<select name="" id="">
								<option value="">无袖</option>
								<option value="">无袖</option>
								<option value="">无袖</option>
							</select>
						</td>
				</tr>
			</table>
			<p class="btn btn-primary">商品规格</p>
			<table class="table table-bordered table-hover" id='spec'>
				<tr class="info">
					<td>尺寸</td>
						<td>
							<select name="" id="">
								<option value="">XL</option>
								<option value="">M</option>
								<option value="">S</option>
							</select>
						</td>
						<td>附加价格：
							<input type="text" name="" id="" />
						</td>
						<td>
							<span class="btn btn-success add-spec">增加规格</span>
						</td>
				</tr>
				<tr class="info">
					<td>尺寸</td>
						<td>
							<select name="" id="">
								<option value="">XL</option>
								<option value="">M</option>
								<option value="">S</option>
							</select>
						</td>
						<td>附加价格：
							<input type="text" name="" id="" />
						</td>
						<td>
							<span class="btn btn-success add-spec">增加规格</span>
						</td>
				</tr>	

			</table>
			<table class='table table-bordered'>
				<tr>
					<th colspan="3" class="btn btn-primary">列表图</th>
				</tr>
				<tr class="info">
					<td>上传图片</td>
					<td>
						<input type="file" name='pic' id='pic'/>
						<script type="text/javascript">
					        $(function() {
					            $('#pic').uploadify({
					                'formData'     : {//POST数据
					                    '<?php echo session_name();?>' : '<?php echo session_id();?>',
					                },
					                'fileTypeDesc' : '上传文件',//上传描述
					                'fileTypeExts' : '*.jpg;*.png',
					                'swf'      : '{{__PUBLIC__}}/uploadify/uploadify.swf',
					                'uploader' : '{{U('upload')}}',
					                'buttonText':'选择文件',
					                'fileSizeLimit' : '2000KB',
					                'uploadLimit' : 10,//上传文件数
					                'width':65,
					                'height':25,
					                'successTimeout':10,//等待服务器响应时间
					                'removeTimeout' : 0.2,//成功显示时间
					                'onUploadSuccess' : function(file, data, response) {
										//转为json
					                    data=$.parseJSON(data);
					                    //获得图片地址
					                    var imageUrl = data.url;
					                    var li="<li path='"+data.path+"' url='"+data.url+"'><img src='"+imageUrl+"' style='width:200px;' /><input type='hidden' name='pic[]' value='"+data.path+"'/></li>";
			//		                    给id=file 添加value值，以便传到后台调用
			//							$("#file").attr('value',imageUrl);
					                    $("#uploadList ul").prepend(li);
					                }
					            });
					        });
					    </script>
						<div id="uploadList">
					        <ul>
					
					        </ul>
					    </div>
					</td>
					<td id='pic-list'></td>
				</tr>
			</table>

			<table class='table table-bordered'>
				<tr>
					<th colspan="3" class="btn btn-primary">商品图册</th>
				</tr>
				<tr class="info">
					<td>上传图片</td>
					<td>
						<input type="file" name='photo' id='photo' />
						<script type="text/javascript">
					        $(function() {
					            $('#photo').uploadify({
					                'formData'     : {//POST数据
					                    '<?php echo session_name();?>' : '<?php echo session_id();?>',
					                },
					                'fileTypeDesc' : '上传文件',//上传描述
					                'fileTypeExts' : '*.jpg;*.png',
					                'swf'      : '{{__PUBLIC__}}/uploadify/uploadify.swf',
					                'uploader' : '{{U('upload_detail')}}',
					                'buttonText':'选择文件',
					                'fileSizeLimit' : '2000KB',
					                'uploadLimit' : 10,//上传文件数
					                'width':65,
					                'height':25,
					                'successTimeout':10,//等待服务器响应时间
					                'removeTimeout' : 0.2,//成功显示时间
					                'onUploadSuccess' : function(file, data, response) {
										//转为json
					                    data=$.parseJSON(data);
					                    //获得图片地址
					                    var imageUrl = data.url;
					                    var li="<li path='"+data.path+"' url='"+data.url+"'><img src='"+imageUrl+"' style='width:200px;' /><input type='hidden' name='photo[]' value='"+data.path+"'/></li>";
					                    
//					                    将后台压入的大中小图片路径打出来，放入隐藏域中
										li += "<li class='hide'><input type='hidden' name='small[]' id='small' value='"+data.path_small+"' /></li>";
										li += "<li class='hide'><input type='hidden' name='medium[]' id='medium' value='"+data.path_medium+"' /></li>";
										li += "<li class='hide'><input type='hidden' name='big[]' id='big' value='"+data.path_big+"' /></li>";
			//		                    给id=file 添加value值，以便传到后台调用
			//							$("#file").attr('value',imageUrl);
					                    $("#uploadList1 ul").prepend(li);
					                    
					                    
					                    
					                }
					            });
					        });
					    </script>
					    <div id="uploadList1">
					        <ul>
					        	
					        </ul>
					    </div>
					</td>
					<td id='photo-list'></td>
				</tr>
			</table>

			<table class='table'>
				<tr class="next_show">
					<th class="btn btn-primary">商品详细</th>
				</tr>
				<tr class="info">
					<td>
						<!--<textarea name="intro" id="intro"></textarea>-->
						<!--调用百度内容模版插件-->
					<script id="editor" type="text/plain" style="width:1024px;height:500px;"  name="intro"></script>
					<script type="text/javascript">
						var ue = UE.getEditor('editor');
					</script>
					</td>
				</tr>
			</table>

			<table class='table'>
				<tr class="next_show">
					<th class="btn btn-primary">售后服务</th>
				</tr>
				<tr class="info">
					<td>
						<textarea name="service" id="service"></textarea>
					</td>
				</tr>
			</table>
			<input type="hidden" name='snshop_type_tid' value='0'/>
			
			<input type="submit" value="确认添加" class="btn btn-primary btn-block btn-large" />
		</fieldset>
	</form>

	</div>
	</div>
	</div>
</body>
</html>